<template>
    <div class="cgisDatas">
        <div>
            <span>物料编号:</span><a-input class="bacClass" v-model="isLyCodeds" :style="{ width: '150px' }" allow-clear />
        </div>
        <div>
            <span>物料名称:</span><a-input class="bacClass" v-model="isLyNameds" :style="{ width: '150px' }" allow-clear />
        </div>
        <a-button type="primary" size="mini" @click="cxCgsLists">查询</a-button>
    </div>
    <a-table :style="{
        height: '500px',
        marginTop: '10px',
    }" :row-selection="{ showCheckedAll: true, width: 50, onlyCurrent: true }" rowKey="typeLesIds"
        v-model:selected-keys="selectedRowKeys2" stripe :bordered="true" :scrollbar="true" sticky-header :pagination="false"
        :columns="cgColumns5" :data="wlListXqs">
        <template #oldNewService="{ record }">
            <el-checkbox v-model="record.oldNewService" disabled :true-label="1" :false-label="0"></el-checkbox>
        </template>
    </a-table>
    <paginationCopys :total="fySelet4.total" show-total show-jumper show-page-size @change="PageSize4"
        @page-size-change="change4" style="justify-content: center" :page-size="fySelet4.size" :current="fySelet4.page" />
</template>
<script setup lang="ts">
import { ref, watch } from "vue"
import { post, get } from "@/api/http"


const props = defineProps({
    whId: Number,
    frimId: Number,
    urlSelect: String
})

const emits = defineEmits(['getRowData'])


const fySelet4: any = reactive({
    total: 10,
    size: 10,
    page: 1
})

const selectedRowKeys2: any = ref([])

const wlListXqs: any = ref([])

const PageSize4 = (val: any) => {
    fySelet4.page = val
    cxCgsLists()
}

const change4 = (val: any) => {
    fySelet4.size = val
    cxCgsLists()
}


const isLyCodeds: any = ref('')
const isLyNameds: any = ref('')
let typeLesIds: any = 0
const cxCgsLists = async () => {
    const res: any = await post({
        url: props.urlSelect,
        data: {
            page: fySelet4.page,
            size: fySelet4.size,
            warehouseId: props.whId,
            materialCode: isLyCodeds.value,
            materialName: isLyNameds.value,
            "companyId": props.frimId,
        }
    })
    if (res.code == 200) {
        wlListXqs.value = res.data.data
        wlListXqs.value.forEach((res: any) => {
            res['typeLesIds'] = typeLesIds++
            res['totalNum2'] = res.totalNum
        })
        fySelet4.total = res.data.total
    }
}

watch(() => selectedRowKeys2.value, () => {
    let kcWhList = wlListXqs.value.filter((e: any) => {
        return selectedRowKeys2.value.includes(e['typeLesIds'])
    })
    console.log(selectedRowKeys2.value)
    emits('getRowData', kcWhList)
})

const delWhList = () => {
    isLyCodeds.value = ''
    isLyNameds.value = ''
    selectedRowKeys2.value = []
    wlListXqs.value = []
}

defineExpose({
    delWhList,
})

const cgColumns5: any = [
    {
        dataIndex: 'companyName',
        key: 'companyName',
        title: '公司',
        width: 150,
    },
    {
        dataIndex: 'warehouseTypeName',
        key: 'warehouseTypeName',
        title: '仓库类型名称',
        width: 150,
    },
    {
        dataIndex: 'warehouseName',
        key: 'warehouseName',
        title: '仓库名称',
        width: 150,
    },
    {
        dataIndex: 'majorCategory',
        key: 'majorCategory',
        title: '物料大类',
        width: 150,
    },
    {
        dataIndex: 'subCategory',
        key: 'subCategory',
        title: '物料小类',
        width: 150,
    },
    {
        dataIndex: 'materialCode',
        key: 'materialCode',
        title: '物料编号',
        width: 150,
    },
    {
        dataIndex: 'materialName',
        key: 'materialName',
        title: '物料名称',
        width: 150,
    },
    {
        dataIndex: 'totalNum',
        key: 'totalNum',
        title: '数量',
        width: 150,
    },
    {
        dataIndex: 'unit',
        key: 'unit',
        title: '单位 ',
        width: 130,
    },
    {
        dataIndex: 'specification',
        key: 'specification',
        title: '规格 ',
        width: 120,
    },
    {
        dataIndex: 'price',
        key: 'price',
        title: '单价',
        width: 120,
    },
    {
        dataIndex: 'grade',
        key: 'grade',
        title: '批次',
        width: 120,
    },
    {
        title: "以旧换新",
        key: "oldNewService",
        dataIndex: "oldNewService",
        slotName: 'oldNewService',
        width: 120,
    },
]
</script>
<style lang="less">
.cgisDatas {
    width: 50%;
    display: flex;
    justify-content: space-between;
}
</style>